<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./code/base.css">
    <link rel="stylesheet" href="./code/xiami.css">
    <link rel="stylesheet" href="./code/YiRen.css">
</head>

<body>

    <!-- 顶部导航栏 -->
    <div class="header container clearfix">
        <div class="XM_logo fl">
            <img src="./img/XM_logo.png" alt="">
        </div>
        <div class="Hnav fl">
            <a href="" class="hnav1">发现</a>
            <a href="">我的音乐</a>
            <a href="">音乐人</a>
            <a href="">客户端下载</a>
            <a href="">会员中心</a>
        </div>

        <input type="text" placeholder="exo">
        <span class="icon_search"></span>
        <div class="login fl"> <a href="">登录/注册</a></div>

    </div>
    <!-- 顶部导航栏end -->

    <!-- 轮播大图 -->
    <div class="container LBpic  clearfix">
        <div class="LB_left fl"><a href=""><img src="./img/party5.jpg" alt=""></a></div>
        <div class="LB_center fl"><a href=""><img src="./img/party.jpg" alt=""></a></div>
        <div class="LB_right fl">
            <div><a href=""><img src="./img/party3.jpg" alt=""></a></div>
        </div>
    </div>
    <!-- 轮播大图 end -->

    <!-- 正版心 -->
    <div class="container clearfix">
        <!-- 左侧定位！！！！ -->
        <div class="L-fixed fl">
            <ul>
                <li class="li1">推荐</li>
                <li><a href="./PaiHangBang.html" target="_blank">排行榜</a></li>
                <li><a href="">歌单</a></li>
                <li><a href="./YiRen.html" target="_blank">艺人</a></li>
                <li><a href="">曲风流派</a></li>
                <li><a href="">专辑</a></li>
                <li><a href="">MV</a></li>
                <li><a href="">厂牌</a></li>
            </ul>
            <div class="download clearfix">
                <div class="fl">
                    <h3>扫描二维码下载</h3>
                    <p>即可体验<br>我们无与伦比的<br>客户端体验</p>

                </div>
                <img src="./img/Eweima.png" alt="">
            </div>
            <div class="icon clearfix">
                <div class="fl">
                    <div class="Ohidden "><a href=""> <img src="./img/apple.png" alt="">
                        </a></div> ios
                </div>
                <div class="fl">
                    <div class="Ohidden "><a href=""> <img src="./img/android.jpg" alt="">
                        </a></div> android
                </div>
                <div class="fl">
                    <div class="Ohidden "><a href=""> <img src="./img/apple.png" alt="">
                        </a></div> ios
                </div>
                <div class="fl">
                    <div class="Ohidden "><a href=""> <img src="./img/apple.png" alt="">
                        </a></div> ios
                </div>
                <div class="fl">
                    <div class="Ohidden "><a href=""> <img src="./img/android.jpg" alt="">
                        </a></div> android
                </div>
                <div class="fl">
                    <div class="Ohidden "><a href=""> <img src="./img/apple.png" alt="">
                        </a></div> ios
                </div>

            </div>
        </div>
        <!-- 左侧定位！！！！end -->
        <!-- 左侧定位！！！end -->

        <!-- 右边版心 s -->
        <div class="contain-right">
            <!-- 每日30首 -->
            <div class="radio-container">
                <div><img src="./img/partySub1.png" alt="">每日30首</div>
                <div><img src="./img/partySub2.png" alt="">猜你喜欢</div>
                <div><img src="./img/partySub3.png" alt="">听见不同</div>
                <div><img src="./img/partySub4.png" alt="">私人电台</div>
            </div>
            <!-- 推荐歌单 -->
            <div class="block-title clearfix">
                <div class="rec-song fl">推荐歌单</div>
                <div class="clearfix fr">
                    全部
                    <span class="icon fl"> > </span>
                </div>
            </div>
            <div class="recommend clearfix">
                <div class="cover fl"><img src="./img/Rec1.jpeg" alt=""></div>
                <div class="type-song"><img src="./img/Rec2.jpg" alt=""><span>26.6万</span>
                    <p><a href="">乐享圣诞 | 音乐与你才是节日的温度</a></p>
                    <h3><a href="">拿索斯古典音乐</a></h3><a href="">#经典 #循环 #治愈</a>
                </div>
                <div class="type-song"><img src="./img/Rec3.gif" alt=""><span>26.6万</span>
                    <p><a href="">乐享圣诞 | 音乐与你才是节日的温度</a></p>
                    <h3><a href="">拿索斯古典音乐</a></h3><a href="">#经典 #循环 #治愈</a>
                </div>
                <div class="type-song"><img src="./img/Rec4.jpg" alt=""><span>26.6万</span>
                    <p><a href="">乐享圣诞 | 音乐与你才是节日的温度</a></p>
                    <h3><a href="">拿索斯古典音乐</a></h3><a href="">#经典 #循环 #治愈</a>
                </div>
                <div class="type-song"><img src="./img/Rec5.jpg" alt=""><span>26.6万</span>
                    <p><a href="">乐享圣诞 | 音乐与你才是节日的温度</a></p>
                    <h3><a href="">拿索斯古典音乐</a></h3><a href="">#经典 #循环 #治愈</a>
                </div>
                <div class="type-song"><img src="./img/Rec6.jpg" alt=""><span>26.6万</span>
                    <p><a href="">乐享圣诞 | 音乐与你才是节日的温度</a></p>
                    <h3><a href="">拿索斯古典音乐</a></h3><a href="">#经典 #循环 #治愈</a>
                </div>
                <div class="type-song"><img src="./img/Rec4.jpg" alt=""><span>26.6万</span>
                    <p><a href="">乐享圣诞 | 音乐与你才是节日的温度</a></p>
                    <h3><a href="">拿索斯古典音乐</a></h3><a href="">#经典 #循环 #治愈</a>
                </div>
                <div class="type-song"><img src="./img/Rec2.jpg" alt=""><span>26.6万</span>
                    <p><a href="">乐享圣诞 | 音乐与你才是节日的温度</a></p>
                    <h3><a href="">拿索斯古典音乐</a></h3><a href="">#经典 #循环 #治愈</a>
                </div>
                <div class="type-song"><img src="./img/Rec5.jpg" alt=""><span>26.6万</span>
                    <p><a href="">乐享圣诞 | 音乐与你才是节日的温度</a></p>
                    <h3><a href="">拿索斯古典音乐</a></h3><a href="">#经典 #循环 #治愈</a>
                </div>
            </div>
            <!-- 推荐歌单 end -->

            <!-- AI日推 -->
            <div class="block-title clearfix">
                <div class="rec-song fl">AI日推</div>
                <div class="clearfix fr">
                    全部
                    <span class="icon fl"> > </span>
                </div>
            </div>
            <div class="clearfix">
                <div class="daliy_rec fl"><img src="./img/AI1.jpg" alt="">
                    <p>梦幻氛围|Dream Vibe.</p>
                </div>
                <div class="daliy_rec fl"><img src="./img/AI2.jpg" alt="">
                    <p>放松系|武侯咖啡馆 伸个懒腰</p>
                </div>
                <div class="daliy_rec fl"><img src="./img/AI3.jpg" alt="">
                    <p>治愈系|温柔乐章 拥你在怀</p>
                </div>
                <div class="daliy_rec fl"><img src="./img/AI4.jpg" alt="">
                    <p>放松系|武侯咖啡馆 伸个懒腰</p>
                </div>
                <div class="daliy_rec fl"><img src="./img/AI5.jpg" alt="">
                    <p>梦幻氛围|Dream Vibe.</p>
                </div>
            </div>
            <!-- AI日推 end -->

            <!-- 中间大播放器 -->
            <div class="radio-c">
                <div class="block-title clearfix">
                    <p>新歌</p>
                    <span class="sp1">推荐</span>
                    <span>华语</span>
                    <span>欧美</span>
                    <span>日本</span>
                    <span>韩国</span>
                </div>
                <div class="Mayday"></div>
                <div class="play-list">
                    <div class="Plist-tit clearfix">

                        <span><img src="./img/bofangqi-bofang.png" alt=""></span>
                        播放全部
                    </div>
                    <!-- 歌列表  -->
                    <div class="dli clearfix">
                        <div class="clearfix"><span>01</span>
                            <div>晕船记</div>
                            <div>陈婧霏</div>
                            <div class="long-time">04:06</div>
                        </div>
                        <div class="clearfix"><span>02</span>
                            <div>因为你 所以我</div>
                            <div>五月天</div>
                            <div class="long-time">04:06</div>
                        </div>
                        <div class="clearfix"><span>03</span>
                            <div>夜游神</div>
                            <div>九连真人</div>
                            <div class="long-time">04:06</div>
                        </div>
                        <div class="clearfix"><span>04</span>
                            <div>xiu</div>
                            <div>Yu Su</div>
                            <div class="long-time">04:06</div>
                        </div>
                        <div class="clearfix"><span>05</span>
                            <div>它没有一个具体的理想</div>
                            <div>何大河</div>
                            <div class="long-time">04:06</div>
                        </div>
                    </div>

                </div>
            </div>
            <!-- 中间大播放器 end-->

            <!-- 新碟速递 -->
            <div class="block-title clearfix">
                <div class="rec-song fl">新碟速递</div>
                <div class="clearfix fr">
                    全部
                    <span class="icon fl"> > </span>
                </div>
            </div>
            <div class="recommend clearfix apa-list">
                <div class="type-song"><img src="./img/XD1.jpg" alt=""><span>26.6万</span>
                    <p><a href="">陈婧霏</a></p>
                    <h3><a href="">陈婧霏</a></h3><a href="" class="star"><span></span></a>
                </div>
                <div class="type-song"><img src="./img/XD2.jpg" alt=""><span>26.6万</span>
                    <p><a href="">乐享圣诞 | 音乐与你才是节日的温度</a></p>
                    <h3><a href="">拿索斯古典音乐</a></h3><a href="" class="star"><span></span></a>
                </div>
                <div class="type-song"><img src="./img/XD3.jpg" alt=""><span>26.6万</span>
                    <p><a href="">乐享圣诞 | 音乐与你才是节日的温度</a></p>
                    <h3><a href="">拿索斯古典音乐</a></h3><a href="" class="star"><span></span></a>
                </div>
                <div class="type-song"><img src="./img/XD4.jpeg" alt=""><span>26.6万</span>
                    <p><a href="">乐享圣诞 | 音乐与你才是节日的温度</a></p>
                    <h3><a href="">拿索斯古典音乐</a></h3><a href="" class="star"><span></span></a>
                </div>
                <div class="type-song"><img src="./img/XD5.jpeg" alt=""><span>26.6万</span>
                    <p><a href="">乐享圣诞 | 音乐与你才是节日的温度</a></p>
                    <h3><a href="">拿索斯古典音乐</a></h3><a href="" class="star"><span></span></a>
                </div>
                <div class="type-song"><img src="./img/XD6.jpg" alt=""><span>26.6万</span>
                    <p><a href="">乐享圣诞 | 音乐与你才是节日的温度</a></p>
                    <h3><a href="">拿索斯古典音乐</a></h3><a href="" class="star"><span></span></a>
                </div>
                <div class="type-song"><img src="./img/XD7.jpg" alt=""><span>26.6万</span>
                    <p><a href="">乐享圣诞 | 音乐与你才是节日的温度</a></p>
                    <h3><a href="">拿索斯古典音乐</a></h3><a href="" class="star"><span></span></a>
                </div>
                <div class="type-song"><img src="./img/XD8.jpg" alt=""><span>26.6万</span>
                    <p><a href="">乐享圣诞 | 音乐与你才是节日的温度</a></p>
                    <h3><a href="">拿索斯古典音乐</a></h3><a href="" class="star"><span></span></a>
                </div>
                <div class="type-song"><img src="./img/XD9.jpg" alt=""><span>26.6万</span>
                    <p><a href="">乐享圣诞 | 音乐与你才是节日的温度</a></p>
                    <h3><a href="">拿索斯古典音乐</a></h3><a href="" class="star"><span></span></a>
                </div>
                <div class="type-song"><img src="./img/XD10.jpg" alt=""><span>26.6万</span>
                    <p><a href="">乐享圣诞 | 音乐与你才是节日的温度</a></p>
                    <h3><a href="">拿索斯古典音乐</a></h3><a href="" class="star"><span></span></a>
                </div>
            </div>
            <!-- 新碟速递 -->

        </div>
        <!-- 右边版心 end -->


        <!-- 底部 -->


        <!-- 底部 -->
    </div>
    <!-- 正版心 end -->
    <div class="footer clearfix">
        <div class="Big-info clearfix fl">
            <div class="info">
                <div class="info-left fl">
                    <span>关于虾米</span>
                    <span>入驻虾米</span>
                    <span>资料补全</span>
                    <span>桌面端</span>
                    <span>合作伙伴</span>
                </div>
                <div class="info-right fl ">
                    <div class="clearfix"><a href="">关于我们</a><a href="">虾米招聘</a><a href="">联系我们</a><a
                            href="">隐私权政策</a><a href="">联系客服</a><a href="">意见反馈</a><a href="">回旧版</a></div>
                    <div class="clearfix"><a href="">音乐人</a><a href="">音乐专栏</a></div>
                    <div class="clearfix"><a href="">添加资料</a><a href="">大家想要的专辑</a><a href="">音频上传</a><a
                            href="">MV上传</a></div>
                    <div class="clearfix"><a href="">pc电脑</a><a href="">苹果电脑</a></div>
                    <div class="clearfix small-pic">
                        <div><img src="./img/AI2.jpg" alt=""></div>
                        <div><img src="./img/XD2.jpg" alt=""></div>
                        <div><img src="./img/AI1.jpg" alt=""></div>
                        <div><img src="./img/AI4.jpg" alt=""></div>
                        <div><img src="./img/AI2.jpg" alt=""></div>
                        <div><img src="./img/party1.jpg" alt=""></div>
                        <div><img src="./img/AI5.jpg" alt=""></div>
                        <div><img src="./img/party3.jpg" alt=""></div>
                        <div><img src="./img/party4.jpg" alt=""></div>
                        <div><img src="./img/party5.jpg" alt=""></div>
                        <div><img src="./img/party4.jpg" alt=""></div>
                        <div><img src="./img/AI1.jpg" alt=""></div>
                        <div><img src="./img/AI2.jpg" alt=""></div>
                        <div><img src="./img/AI1.jpg" alt=""></div>
                        <div><img src="./img/AI3.jpg" alt=""></div>
                        <div><img src="./img/AI1.jpg" alt=""></div>
                        <div><img src="./img/AI2.jpg" alt=""></div>
                        <div><img src="./img/AI1.jpg" alt=""></div>
                        <div><img src="./img/AI2.jpg" alt=""></div>
                        <div><img src="./img/AI1.jpg" alt=""></div>
                    </div>
                </div>
            </div>

        </div>
        <div class="focus-us fl">
            <div>关注我们</div>
            <div>
                <span><img src="./img/weibo.png" alt=""></span>
                <span><img src="./img/weixin.png" alt=""></span>
                <span><img src="./img/zhihu.png" alt=""></span>
            </div>
        </div>
        <div class="Erweima fr">
            <p>虾米音乐APP</p>
            <div><img src="./img/Eweima.png" alt=""></div>
        </div>
        <div class="line"></div>
        <!-- footer 最下面 -->
        <ul>
            <li><a href="">淘宝网</a></li>
            <li>|</li>
            <li><a href="">天猫</a></li>
            <li>|</li>
            <li><a href="">支付宝</a></li>
            <li>|</li>
            <li><a href="">飞猪</a></li>
            <li>|</li>
            <li><a href="">聚划算</a></li>
            <li>|</li>
            <li><a href="">阿里云</a></li>
            <li>|</li>
            <li><a href="">阿里妈妈</a></li>
            <li>|</li>
            <li><a href="">1688</a></li>
            <li>|</li>
            <li><a href="">AliOS</a></li>
            <li>|</li>
            <li><a href="">阿里通信</a></li>
            <li>|</li>
            <li><a href="">万网</a></li>
            <li>|</li>
            <li><a href="">阿里游戏</a></li>
            <li>|</li>
            <li><a href="">大麦网</a></li>
            <li>|</li>
            <li><a href="">一淘</a></li>
            <li>|</li>
            <li><a href="">狂野飙车9</a></li>
            <li>|</li>
            <li><a href="">UCCricket</a></li>
            <li>|</li>
            <li><a href="">阿里安全</a></li>


        </ul>
        <div class="subfont">
            <p> © 2007 - 2020 杭州阿里巴巴音乐科技有限公司 版权所有 阿里巴巴旗下公司</p>
            <ul class="subul clearfix">
                <li><a href="">营业执照</a></li>
                <li>|</li>
                <li><a href="">网络文化经营许可证 :浙网文(2019)4999-453号</a></li>
                <li>|</li>
                <li><a href="">增值电信业务经营许可证 :浙B2-20110188 </a></li>
                <li>|</li>
                <li><a href="">浙ICP备18050417号-2</a></li>
                <li>|</li>
                <li><a href="">浙公网安备 33011002012729号</a></li>
            </ul>
        </div>
    </div>


</body>


</html>